/* pages/index/animation/animation.wxss */


.imgBox {
  display: flex;
  position: relative;
  width: 60vw;

  .pen {
    width: 100%;
    height: 120rpx;
  }

  .stars {
    position: absolute;
    top: 0;
    right: 0;
    width: 20vw;

    image {
      width: 70rpx;
      height: 70rpx;
      position: absolute;
      animation: anmi 0.8s infinite alternate;
    }

    .red_star {
      top: -4rpx;
      right: 10rpx;
    }

    .yellow_star {
      top: 25rpx;
      left: 0rpx;
    }

    .blue_star {
      top: 75rpx;
      right: 25rpx;
    }

    @keyframes anmi {
      0% {
        width: 75rpx;
        height: 75rpx;
        transform: rotate(-10deg);
      }

      50% {
        width: 70rpx;
        height: 70rpx;
        transform: rotate(0deg);
      }

      100% {
        width: 75rpx;
        height: 75rpx;
        transform: rotate(20deg);
      }
    }
  }
}